<template>
    <div class="content">
        <ul class="list" v-html="learnModel.context">
            

        </ul>
    </div>
</template>
<script setup lang="ts">
         import type { LearnModel } from '@/api/international';
import {learnApi} from '@/api/international/index';
const learnModel=ref<LearnModel>({context:''}) 
onMounted( async()=>{
     const response=await learnApi(2)
     if(response.code===200){
        learnModel.value=response.data ?? {context:''}
     }
})
 
</script>
<style scoped lang='less'>
.content {
    width: calc(100% - 220px);
    // background-color: red;
    height: 100%;
    padding-left: 25px;

    >.list {
        li:first-child {
            font-size: 20px;
            font-weight: bold;

        }

        li {

            list-style: none;
            font-size: 18px;
            font-weight: 400;
            color: #434343;
            line-height: 40px;

            img {
                max-width: 100%;
            }
        }



        li:not(:first-child) {
            margin-top: 15px;
            color: #727171;
        }
    }

    >.list:nth-child(n+2) {
        margin-top: 20px;
    }
}
</style>